<template>
  <div class="app-container" >
      <el-row style="background-color: yellow;">
          <el-col :span="24">
              <div class="grid-content bg-purple-dark">客户信息</div>
          </el-col>
      </el-row>
      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
          <el-form-item label="借款订单编号" prop="id">
              <el-input v-model="queryParams.id" placeholder="" clearable style="width: 140px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="借款状态" prop="borrowStatus">
              <el-input v-model="queryParams.borrowStatus" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="客户姓名" prop="clientName">
              <el-input v-model="queryParams.clientName" placeholder="" clearable style="width: 140px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="来源渠道" prop="source">
              <el-input v-model="queryParams.source" placeholder="" clearable style="width: 140px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="客户电话" prop="clientPhone">
              <el-input v-model="queryParams.clientPhone" placeholder="" clearable style="width: 140px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>

      </el-form>
      <el-row style="background-color: yellow;">
          <el-col :span="24">
              <div class="grid-content bg-purple-dark">车辆信息</div>
          </el-col>
      </el-row>
      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
          <el-form-item label="处置状态" prop="disposalStatus">
              <el-input v-model="queryParams.disposalStatus" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="车辆品牌" prop="carBrand">
              <el-input v-model="queryParams.carBrand" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="车牌号" prop="carNum">
              <el-input v-model="queryParams.carNum" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="车辆年限" prop="carAge">
              <el-input v-model="queryParams.carAge" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="车架号" prop="frameNum">
              <el-input v-model="queryParams.frameNum" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="发动机号" prop="engineNum">
              <el-input v-model="queryParams.engineNum" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="排量" prop="displacement">
              <el-input v-model="queryParams.displacement" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="核定载人数" prop="passengerNum">
              <el-input v-model="queryParams.passengerNum" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="车身颜色" prop="carColor">
              <el-input v-model="queryParams.carColor" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="购车时间" prop="buyTime">
              <el-input v-model="queryParams.buyTime" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="裸车价格" prop="carPrice">
              <el-input v-model="queryParams.carPrice" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="上牌时间" prop="licenseTime">
              <el-input v-model="queryParams.licenseTime" placeholder="" clearable style="width: 150px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="行驶里程" prop="carRoad">
              <el-input v-model="queryParams.carRoad" placeholder="" clearable style="width: 250px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="保险止期" prop="insuranceTime">
              <el-input v-model="queryParams.insuranceTime" placeholder="" clearable style="width: 250px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
                  
          </el-form-item>
          <el-form-item label="车况" prop="carCondition">
              <el-input v-model="queryParams.carCondition" placeholder="" clearable style="width: 250px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="车辆用途" prop="carUse">
              <el-input v-model="queryParams.carUse" placeholder="" clearable style="width: 250px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="有无重大事故" prop="accident">
              <el-input v-model="queryParams.accident" placeholder="" clearable style="width: 250px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="违章情况" prop="breakRules">
              <el-input v-model="queryParams.breakRules" placeholder="" clearable style="width: 250px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="过户、抵押次数" prop="mortgageNum">
              <el-input v-model="queryParams.mortgageNum" placeholder="" clearable style="width: 250px"
                  @keyup.enter.native="handleQuery" readonly="readonly" />
          </el-form-item>
          <el-form-item label="创建时间" prop="createTime">
              <el-input v-model="queryParams.createTime" placeholder="" clearable style="width: 250px"
                  @keyup.enter.native="handleQuery" readonly="readonly" >
                </el-input>
                  
          </el-form-item>
      </el-form>

      

  </div>
</template>

<script>
import { findOne } from '@/api/pledge/carManagement'


export default {

  
  dicts: ['house_manager_disposal_status'],
  data() {
      return {
          // 遮罩层
          loading: true,
          // 选中数组
          ids: [],
          // 非单个禁用
          single: true,
          // 非多个禁用
          multiple: true,
          // 显示搜索条件
          showSearch: true,
          // 总条数
          total: 0,

          
          // 弹出层标题
          title: "",
          // 是否显示弹出层
          open: false,
          resData: [],
          // 查询参数
          queryParams: {
              pageNum: 1,
              pageSize: 10,
              roleName: undefined,
              roleKey: undefined,
              status: undefined,

              id: undefined,
              clientName: undefined,
              borrowStatus: undefined,
              source: undefined,
              clientPhone: undefined,
              disposalStatus: undefined,
              carBrand: undefined,
              carNum: undefined,
              carAge: undefined,
              frameNum: undefined,
              engineNum: undefined,
              displacement: undefined,
              passengerNum: undefined,
              carColor: undefined,
              buyTime: undefined,
              carPrice: undefined,
              licenseTime: undefined,
              carRoad: undefined,
              insuranceTime: undefined,
              carCondition: undefined,
              carUse: undefined,
              accident: undefined,
              breakRules: undefined,
              mortgageNum: undefined
          },
          // 表单参数
          form: {},
          defaultProps: {
              children: "children",
              label: "label"
          },
          // 表单校验
          rules: {
              roleName: [
                  { required: true, message: "角色名称不能为空", trigger: "blur" }
              ],
              roleKey: [
                  { required: true, message: "权限字符不能为空", trigger: "blur" }
              ],
              roleSort: [
                  { required: true, message: "角色顺序不能为空", trigger: "blur" }
              ]
          }
      };
  },
  created() {
      const id = this.$route.params.id;
      this.id = id;
      console.log(this.id);
      this.getOne();
  },
  methods: {

      getOne() {
          this.loading = true;
          findOne(this.id).then(res => {
              console.log(res);
              let resData = [];
              resData.push(res.data);
              this.queryParams = resData[0];
              console.log(res.data);
              this.loading = false;
          }
          ).catch()
      },


      // 取消按钮
      cancel() {
          this.open = false;
          this.reset();
      },
      // 取消按钮（数据权限）
      cancelDataScope() {
          this.openDataScope = false;
          this.reset();
      },
      // 表单重置
      reset() {

      },
      /** 搜索按钮操作 */
      handleQuery() {
          this.queryParams.pageNum = 1;
          this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
          this.dateRange = [];
          this.resetForm("queryForm");
          this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
          this.ids = selection.map(item => item.roleId)
          this.single = selection.length != 1
          this.multiple = !selection.length
      },

      /** 导出按钮操作 */
      handleExport() {
          this.download('houseProperty/export', {
              ...this.queryParams
          }, `房屋管理信息_${new Date().getTime()}.xlsx`)
      }
  }
};
</script>
<style>

</style>